import { InjectionKey } from 'vue';
import { createStore, useStore as baseUseStore, Store } from 'vuex';
import { ITabe } from './type';

export interface State {
  count: number,
  collapse: boolean,
  tabsList: Array<ITabe>,
  notice:any,
  userInfo:any
}

export const key: InjectionKey<Store<State>> = Symbol()

export const store = createStore<State>({
  state: {
    count: 0,
    collapse: false,
    tabsList: [],
    notice:[],
    userInfo:{}
  },
  mutations: {
    setuserInfo(state: State, userInfo: any){
      state.userInfo = userInfo
      sessionStorage.setItem('userInfo',JSON.stringify(userInfo))
    },
    addNotice(state: State, notice: any){
      state.notice = notice
      sessionStorage.setItem('notice',JSON.stringify(notice))
    },
    setCount(state: State, count: number) {
      state.count = count
    },
    setCollapse(state: State, collapse: boolean) {
      state.collapse = collapse
    },
    addTabe(state: State, tab: ITabe) {
      // 判断是否已经存在,如果不存在,才放入
      if(state.tabsList.some(item => item.path === tab.path)) return;
      state.tabsList.push(tab)
    }
  },
  getters: {
    getuserInfo(state:State){
      if(!state.userInfo){
      // alert(1)
      // console.log(state)
        var arr:any = sessionStorage.getItem('userInfo')
        var arr1 = JSON.parse(arr)
        state.userInfo = arr1
      }
      return state.userInfo
    },
    getCount(state: State) {
      return state.count
    },
    getCollapse(state: State) {
      return state.collapse
    },
    // 获取Tabs
    getTabs(state: State) {
      return state.tabsList
    }
  }
})

// 定义自己的 `useStore` 组合式函数
export function useStore() {
  return baseUseStore(key)
}
